<template>
  <a-select v-model="selected" style="width: 200px" @change="handleChange">
    <a-select-option v-for="item in options" :key="item[optionKey]">{{ item[optionsShowName] }}</a-select-option>
    <template v-if="selectOptGroup">
      <a-select-opt-group>
        <span slot="label"><a-icon type="user" />Manager</span>
      </a-select-opt-group>
    </template>
    
  </a-select>
</template>
<script>
export default {
  name: 'AnSelect',
  props: {
    selectOptGroup: {
      type: Boolean,
      default: true
    },
    optionKey: {
      type: String,
      default: 'id'
    },
    optionsShowName: {
      type: String,
      default: 'value'
    }
  },
  data(){
    return {
      selected: '',
      options: [
        {'value': '百度搜索','checked': 0,'unique': 0},
        {'value': '搜狗','checked': 0,'unique': 0},
        {'value': '360搜索','checked': 0,'unique': 0},
        {'value': '神马','checked': 0,'unique': 0},
        {'value': '今日头条','checked': 0,'unique': 0},
        {'value': '广点通','checked': 0,'unique': 0},
        {'value': '智慧推','checked': 0,'unique': 0},
        {'value': '新浪扶翼','checked': 0,'unique': 0},
        {'value': '搜狐汇算','checked': 0,'unique': 0},
        {'value': '百度信息流','checked': 0,'unique': 0},
        {'value': '360信息流','checked': 0,'unique': 0},
        {'value': 'UC','checked': 0,'unique': 0},
        {'value': '知乎','checked': 0,'unique': 0},
        {'value': '快手','checked': 0,'unique': 0}
      ]
    }
  },
  methods: {
    handleChange(value) {
      console.log(`selected ${value}`)
    }
  }
}
</script>
